﻿
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>

</head>
<body>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->


<script  src="${request.getContextPath()}/js/echarts/echarts.js"></script>
<script  src="${request.getContextPath()}/js/echarts/echarts-tool.js"></script>
<div id="myChart" style="width: 700px;height:500px;"></div>
<script type="text/javascript">
    var contextPath = "${request.getContextPath()}";
    eChartsTool.init(contextPath);

    option = {
        title : {
            text: '全所在制品批数',
            subtext: '分布情况',
            x:'center'
        },
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            orient : 'vertical',
            x : 'left',
            data:['${qtyList.NAME[0]}','${qtyList.NAME[1]}','${qtyList.NAME[2]}']
        },
        toolbox: {
            show : true,
            feature : {
              //  mark : {show: true},
               // dataView : {show: true, readOnly: false},
                magicType : {
                    //show: true,
                    type: ['pie', 'funnel'],
                    option: {
                        funnel: {
                            x: '25%',
                            width: '50%',
                            funnelAlign: 'left',
                            max: 1548
                        }
                    }
                },
                //restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        calculable : true,
        series : [
            {
                name:'访问来源',
                type:'pie',
                radius : '55%',
                center: ['50%', '60%'],
                data:[
                    {value:${qtyList.NEW_QTY[0]}, name:'${qtyList.NAME[0]}'},
                    {value:${qtyList.NEW_QTY[1]}, name:'${qtyList.NAME[1]}'},
                    {value:${qtyList.NEW_QTY[2]}, name:'${qtyList.NAME[2]}'}
                ]
            }
        ]
    };


    // 使用刚指定的配置项和数据显示图表。
    eChartsTool.setOption("dark", document.getElementById('myChart'), option);
</script>
</body>
</html>

